<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="../../css/public/bootstrap.min.css">
    <link rel="stylesheet" href="../../css/personal/common.css"/>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../../css/personal/pasonnal-page.css"/>
    <link rel="stylesheet" href="../../css/personal/time-zhou.css"/>
    <title>个人页面</title>
</head>
<body onselect="document.selection.empty()">
<div id="pasonnalPage">
    <header>
        <a href="javascript:;" onclick="window.history.back()"><img src="../../images/back.png" class="go-back" alt=""/></a>
        <h4>个人页面</h4>
        <img src="../../images/more-btn.png" class="more-btn" alt=""/>
    </header>
    <section class="pasonnal-contnet">
        <a href="./personnal-information.html">
            <div><img src="../../images/head-personnal.png" class="pasonnal-head" alt=""/></div>
            <p><span class="p-name">姓名</span><span>已激活</span></p>
        </a>
    </section>
    <footer class="footer">
        <ul class="nav nav-pills container">
        	<div class="row defined_tab">
        		<li class="col-xs-4 active">
	                <a href="javascript:;" class="process">历程</a>
	            </li>
	            <li class="col-xs-4">
	                <a href="javascript:;" class="share">分享</a>
	            </li>
	            <li class="col-xs-4">
	                <a href="javascript:;" class="family">亲属</a>
	            </li>
        	</div>
        </ul>
        <div class="tab-content">
            <!--历程-->
            <div id="process" class="tab-pane fade in active">
                <section id="cd-timeline" class="cd-container">
                    <div class="cd-timeline-block">
                        <div class="cd-timeline-img cd-picture">
                            <img src="../../images/cd-icon-picture.svg" alt="Picture">
                        </div>

                        <div class="cd-timeline-content">

                        </div>
                    </div>
                    <div class="cd-timeline-block">
                        <div class="cd-timeline-img cd-movie">
                            <img src="../../images/cd-icon-movie.svg" alt="Movie">
                        </div>

                        <div class="cd-timeline-content">

                        </div>
                    </div>
                    <div class="cd-timeline-block">
                        <div class="cd-timeline-img cd-movie">
                            <img src="../../images/cd-icon-location.svg" alt="Location">
                        </div>

                        <div class="cd-timeline-content">

                        </div>
                    </div>
                </section>
                <div class="add-process">
                    <img src="../../images/add.png" alt=""/>
                </div>
            </div>
          	
            <!--分享-->
            <div id="share" class="tab-pane fade">
                <ul>
                    <li class="container">
                        <div class="row">
                            <div class="col-xs-6 share-time">
                                <div>
                                    <span class="share-time-day">25</span><span class="share-time-mouth">3</span>月
                                </div>
                            </div>
                            <div class="col-xs-6 share-content">
                                <img src="../../images/share-img.png" class="share-img" alt=""/>
                                <span class="share-text">今天做了一件很有意义的事</span>
                            </div>
                        </div>
		                <!--评论区域-->
		                <div class="cmt_area">                 
		                    <p class="issue_cont">
		                    	<span class="issue_id">小明</span>
		                    	<span>：</span>
		                    	<span>我们都是好孩子一个孤独的好孩子我说的经典的简单地念叨念叨念叨念叨</span>
		                    </p>
		                    <p class="issue_cont">
		                    	<span class="issue_id">小明</span>
		                    	<span>：</span>
		                    	<span>我们都是好孩子一个孤独的好孩子我说的经典的简单地念叨念叨念叨念叨</span>
		                    </p>
		                </div>
		           
                        <div class="row share-method">
                            <div class="col-xs-6 dianzan">
                                <img src="../../images/dianzan1.png" alt=""/>
                                <span class="dianzan-count">20</span>
                            </div>
                            <div class="col-xs-6 comment">
                                <img src="../../images/pinglun.png" alt=""/>
                                <span class="pinglun-count">7</span>
                            </div>
                        </div>
                    </li>
                </ul>
                <img src="../../images/sharebtn.png" class="share_btn"/>
            </div>
            <!--亲属-->
            <div id="family" class="tab-pane fade">
                <ul class="relation">
                    <li>
                        <a href="javascript:;">
                            <img src="../../images/head-personnal.png" alt=""/>
                            <span>刘强</span>
                            <span class="family-relation">父亲</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="../../images/head-personnal.png" alt=""/>
                            <span>赵氏</span>
                            <span class="family-relation">母亲</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="../../images/head-personnal.png" alt=""/>
                            <span>小强</span>
                            <span class="family-relation">长子</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:;">
                            <img src="../../images/head-personnal.png" alt=""/>
                            <span>小明</span>
                            <span class="family-relation">次子</span>
                        </a>
                    </li>
                </ul>
                <div id="add-img" class="add-img dropdown">
                    <img src="../../images/add.png" class="dropdown-toggle" id="dropdownMenu" data-toggle="dropdown" alt=""/>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                        <li role="presentation">
                            <a role="menuitem" class="add-editor" tabindex="-1" href="#">
                                父母
                            </a>
                        </li>
                        <li role="presentation">
                            <a role="menuitem" class="add-editor" tabindex="-1" href="#">
                                丈夫/妻子
                            </a>
                        </li>
                        <li role="presentation">
                            <a role="menuitem" class="add-editor" tabindex="-1" href="#">
                                兄弟姐妹
                            </a>
                        </li>
                        <li role="presentation">
                            <a role="menuitem" class="add-editor" tabindex="-1" href="#">
                                子女
                            </a>
                        </li>
                    </ul>
                </div>
            
            	<!--删除亲属蒙版-->
	            <div class="relation_mask"></div>
	            <div class="relation_pop">
	            	<h5>确认删除该亲属?</h5>
	            	<ul id="relation_del">
	            		<li class="relation_sure relation_btn">确认</li>
	            		<li class="relation_cancle relation_btn">取消</li>
	            	</ul>
	            </div>
            </div>
            
        </div>
    </footer>
</div>
<!--头部隐藏按钮-->
<div class="shows">
    <div id="zhezhaoceng"></div>
    <div id="close">
        <div><a href="../family/family-tree.html">查看家谱</a></div>
        <div class="delete-family">删除亲属</div>      <!--点击删除亲属-->
    </div>
</div>
<!--新增历程-->
<div id="addProcess">
    <div class="addProcess-head">
        <a href="#"><img src="../../images/back.png" class="go-back" alt=""/></a>
        <h5>历程</h5>
        <button class="btn btn-success" id="editSuccess">完成</button>
    </div>
    <div class="addProcess-content">
        <div style="position: relative">
            <input type="file"/>
            <img src="../../images/photo-load.png" class="photo-load" alt=""/>
        </div>
        <textarea rows="5" class="process-detail" placeholder="添加历程"></textarea>
    </div>
    <div>
        <input type="text"  placeholder="选择历程时间" id="processTime">
    </div>
</div>

<!--发布分享-->
<div id="publish">
	<div class="container">
		<ul class="share_top row">
			<li class="col-xs-2 cancle_share">取消</li>
			<li class="col-xs-8 font_title">发表文字</li>
			<li class="col-xs-2 issue_share"><button>发送</button></li>
		</ul>
		<div class="share_box">
			<textarea name="" rows="" cols="" class="share_cont" placeholder="这一刻的想法..."></textarea>
			<div class="img_box">
				<ul class="img_place">	
					<!--<li>
						<img src="../../images/123.jpg">
					</li>
					<li>
						<img src="../../images/1.jpg">
					</li>-->
					<li>
						<label for="add_more" id="oLab">
							<img src="../../images/add_more.png"/>
							<input type="file" name="add_more" id="add_more" value="" multiple="multiple"/>
						</label>						
					</li>
					
				</ul>
				
			</div>
		</div>
		<!--<div class="container posit" id="getLoc">
			<div class="row">
				<div class="col-xs-2 pos_area">
					<img src="../../images/position.png" alt="" />
				</div>
				<div class="col-xs-8 pos_area" id="locMess">
					所在位置
				</div>
				<div class="col-xs-2 pos_area">
					<img src="../../images/tiaozhuan.png" alt="" />
				</div>
			</div>
		</div>-->
		
		<div class="shareTo">			
			<span>分享给家族成员</span>
			<img src="../../images/fordown.png"/>
		</div>
		<ul class="shareMem">
			<li>			
				<input type="checkbox" class="checked">
				<label></label>
				<span>小润</span>
			</li>
			<li>				
				<input type="checkbox" class="checked"/>
				<label></label>
				<span>梦雷</span>
			</li>
			<li>				
				<input type="checkbox" class="checked"/>
				<label></label>
				<span>光光</span>
			</li>
		</ul>
	</div>
</div>

<!--发表评论-->
<div class="cmt_btm container">
	<div class="row cmt_box">
		<div class="col-xs-10">
			<textarea placeholder="评论一下：）" class="cmt_cont"></textarea>
		</div>
		<div class="col-xs-2">
			<input type="button" name="" id="cmt_issue" value="发表" />
		</div>
	</div>
</div>
<!--新增人物编辑-->
<div id="addEditor">
    <div class="addEditor-head">
        <a href=""><img src="../../images/back.png" class="go-back" alt=""/></a>
        <h4>编辑</h4>
    </div>
    <div class="addEditor-content">
        <div class="add-head">
            <input type="file"/>
            <img src="../../images/headadd.png" alt=""/>
        </div>
        <form class="bs-example bs-example-form" role="form">
            <div class="input-group">
                <span class="input-group-addon">姓</span>
                <input type="text" class="form-control" placeholder="输入姓氏">
            </div>
            <br>
            <div class="input-group">
                <span class="input-group-addon">名</span>
                <input type="text" class="form-control" placeholder="输入名字">
            </div>
        </form>
        <div class="addEditor-source">
            <label for="name">性别</label>
            <label class="checkbox-inline">
                <input type="radio" name="optionsRadiosinline" id="optionsRadios1" value="option1" checked>男
            </label>
            <label class="checkbox-inline">
                <input type="radio" name="optionsRadiosinline" id="optionsRadios2" value="option2">女
            </label>
        </div>
        <div class="checkbox">
            <label for="name">健在</label>
            <label><input type="checkbox" value=""></label>
        </div>
        <div class="container container-editor">
            <div class="row">
                <div class="col-xs-6">出生日期</div>
                <div class="col-xs-6">
                    <div class="input-append date form_datetime">
                        <!--<input class="form-control" placeholder="" type="text" name="brithday"  value="">-->
                        <input class="form-control" type="text"  placeholder="添加出生日期" id="processTime1">
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-6">手机</div>
                <div class="col-xs-6">
                    <input class="form-control" placeholder="添加手机号码作为账号" type="tel"  value="">
                </div>
            </div>
            <div class="row">
                <div class="col-xs-6">微信号</div>
                <div class="col-xs-6">
                    <input class="form-control" placeholder="绑定微信账号" type="text"  value="">
                </div>
            </div>
            <button class="btn btn-default">确定</button>
        </div>
        <div id="datePlugin"></div>
    </div>
    <!--从家族当中选择-->
    <div class="shareTo">			
		<span>从家族成员中选择</span>
		<img src="../../images/fordown.png"/>
	</div>
	<ul class="shareMem">
		<li class="applay_people">			
			<span>小润</span>
		</li>
	</ul>
	<!--从家族成员中选择蒙版-->
    <div class="member_mask"></div>
    <div class="member_pop">
    	<h5>确人选择该家族成员?</h5>
    	<ul id="member_add">
    		<li class="member_sure member_btn">确认</li>
    		<li class="member_cancle member_btn">取消</li>
    	</ul>
    </div>
</div>
</body>
<script src="../../js/public/jquery-2.2.3.min.js"></script>
<script src="../../js/public/bootstrap.min.js"></script>
<script src="../../js/personal/pasonnal-page.js"></script>
<script src="../../js/public/date.js"></script>
<script src="../../js/public/iscroll.js"></script>
<script>
 	$('#overTime').date();
    $('#processTime').date();
    $('#processTime1').date();
    
</script>
</html>